export default function GetStartedCard() {
  return (
    <div className="upload-card upload-card-shadow p-[16px]">
      <h3 className="text-[#9fb7ff] text-[14px] font-semibold tracking-wider mb-4">Get Started</h3>

      <div className="space-y-4">
        {/* 邮箱验证 */}
        <div className="todo-item flex items-start gap-3 rounded-lg p-4 hover:bg-[#141a28] transition">
          <div className="w-3 h-3 bg-[#38bdf8] rounded-full mt-1"></div>
          <div>
            <p className="text-white font-medium">Verify your email</p>
            <p className="text-gray-400 text-sm">
              We sent a confirmation to <span className="text-gray-300">your@email.com</span>. Click the link inside to
              screen your first deck. <span className="text-[#38bdf8] hover:underline cursor-pointer">Resend link</span>
            </p>
          </div>
        </div>

        {/* Profile */}
        <div className="todo-item flex items-start gap-3 rounded-lg p-4 hover:bg-[#141a28] transition">
          <div className="w-3 h-3 bg-[#38bdf8] rounded-full mt-1"></div>
          <div>
            <p className="text-white font-medium">Complete your profile (~2min)</p>
            <p className="text-gray-400 text-sm">
              Tell us about your firm so we can tailor reports.{' '}
              <span className="text-[#38bdf8] hover:underline cursor-pointer">Add company info</span>
            </p>
          </div>
        </div>
      </div>
    </div>
  )
}
